<!-- 03标签选择器
    特点
    1.同02语法
    2.标签选择器可以选择html中所有的标签（但也只能用已有的标签）
    3.在head下写style，里面写“标签名 {css属性}”
    4.无法使多个同名标签各不同
-->

<!-- 04类选择器
    特点
    1.在标签中添加class属性
    2.在style中写“.类名 {css属性}”
    3.在使用的标签中添加class属性，属性值为类名
    4.一个标签可以有多个类名，类名之间用空格隔开
    5.可单独控制多个同名标签
    6.类名不可用数字或中划线开头
-->

<!-- 05id选择器
    语法
    1.在标签中添加id属性
    2.在style中写“#id名 {css属性}”
    特点
    1.配合js使用
    2.一个标签只能有一个id名
    3.不可用数字或中划线开头
    4.只能在一个标签中加Id属性
-->

<!-- 06通配符选择器
    语法
    *{css属性}
    特点
    1.对所有标签生效
    2.一般用来改外间距
 -->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 03 */
        div{
            color:red;
            font-size: large;
        }
        
        /* 04 */
        .test{
            color: rebeccapurple;
            font-size: small;
        }

        /* 05 */
        #test{
            color: blue;
            font-size: medium;
        }

        /* 06 */
        *{
            margin: 0px;
            padding: 0px;
        }
    </style>
</head>
<body>
    <!-- 03 -->
    <div>这是用标签选择器</div>

    <!-- 04 -->
    <div class="test">这是用类选择器</div>

    <!-- 05 -->
     <div id="test">这是id选择器</div>
</body>
</html>